<template>
    <div id="app">
        <div class="login-box">

            <el-row>
                <el-col :span="10">
                    <el-input id="name" v-model="student.account" placeholder="请输入帐号">
                        <template slot="prepend">帐号</template>
                    </el-input>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="10">
                    <el-input id="password" v-model="student.password" type="password" placeholder="请输入密码">
                        <template slot="prepend">密码</template>
                    </el-input>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="10">
                    <el-button id="signup" v-on:click="signup" style="width:45%" plain>注册</el-button>
                    <el-button id="login" v-on:click="login" style="width:45%" type="primary">登录</el-button>
                </el-col>
            </el-row>
        </div>

    </div>
</template>
<script>
export default {
    data() {
        return {
            student: {
                account: "",
                password: ""
            }
        }
    },
    methods: {
        login: function() {
            //获取值  
            var name = this.student.account;
            var password = this.student.password;
            console.log("==========================")
            console.log(name)
            console.log(password)
            console.log("==========================")
            if (name == '' || name == 'undefined' || name == null) {
                this.$message({
                    message: '请输入你的帐号！',
                    type: 'error'
                })
                return;
            }
            if (password == '' || password == 'undefined' || password == null) {
                this.$message({
                    message: '请输入你的密码！',
                    type: 'error'
                })
                return;
            }
            var formData = JSON.stringify(this.student); // 这里才是你的表单数据
            this.$http.post('http://localhost:8081/login.php', formData)
                .then((response) => {
                    console.log(response.data)
                    console.log(formData)

                    if (response.data.code == 0) {
                        this.$notify({
                            title: '提示',
                            type: 'success',
                            message: '登录成功(' + response.data.data.detail + ')',
                            duration: 3000
                        })
                    }
                    else {
                        this.$notify.error({
                            title: '错误',
                            message: response.data.data.detail + '(' + response.data.code + ')',
                            duration: 3000
                        });
                    }


                }).catch(function(response) {
                    console.log(response)
                });

        },
        signup: function() {
            var name = this.student.account;
            var password = this.student.password;
            console.log("==========================")
            console.log(name)
            console.log(password)
            console.log("==========================")
            if (name == '' || name == 'undefined' || name == null) {
                this.$message({
                    message: '请输入你的帐号！',
                    type: 'error'
                })
                return;
            }
            if (password == '' || password == 'undefined' || password == null) {
                this.$message({
                    message: '请输入你的密码！',
                    type: 'error'
                })
                return;
            }
            var formData = JSON.stringify(this.student); // 这里才是你的表单数据
            this.$http.post('http://localhost:8081/signup.php', formData)
                .then((response) => {
                    console.log(response.data)
                    console.log(formData)

                    if (response.data.code == 0) {
                        this.$notify({
                            title: '提示',
                            type: 'success',
                            message: '注册成功(' + response.data.code + ')',
                            duration: 3000
                        })
                    }
                    else {
                        this.$notify.error({
                            title: '错误',
                            message: response.data.data.detail + '(' + response.data.code + ')',
                            duration: 3000
                        });
                    }


                }).catch(function(response) {
                    console.log(response)
                });

        }
    }

}
</script>
<style lang="scss">
.el-row {
    margin-bottom: 20px;
    &:last-child {
        margin-bottom: 0;
    }
}

.login-box {
    margin-top: 8%;
    margin-left: 40%;
}
</style>
